*,
p {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  background: #1f2327;
}

#host {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;

  /* 有一个元素 */
  // div:only-child {
  //   background-color: pink !important;
  // }
  /* 有二个元素 */
  div:first-child:nth-last-child(2),
  div:first-child:nth-last-child(2)~div {
    // width: 50% !important;
    height: 50% !important;
    // background-color: rgb(96, 96, 163) !important;
  }

  /* 有三个元素 */
  div:first-child:nth-last-child(3),
  div:first-child:nth-last-child(3)~div {
    width: 50% !important;
    height: 50% !important;
    // background-color: rgb(87, 58, 83) !important;
  }

  /* 有四个元素 */
  div:first-child:nth-last-child(4),
  div:first-child:nth-last-child(4)~div {
    width: 50% !important;
    height: 50% !important;
    // background-color: rgb(94, 143, 74) !important;
  }

  /* 有五个元素 */
  div:first-child:nth-last-child(5),
  div:first-child:nth-last-child(5)~div {
    width: 50% !important;
    height: 33.3% !important;
    // background-color: rgb(77, 157, 160) !important;
  }

  /* 有六个元素*/
  div:first-child:nth-last-child(6),
  div:first-child:nth-last-child(6)~div {
    width: 33.3% !important;
    height: 33.3% !important;
    // background-color: rgb(77, 157, 160) !important;
  }

  #box:hover {
    .btn {
      display: block !important;
    }
  }
}

.ant-modal-content {
  padding-top: 0 !important;
}